import 'package:eplorex/dao/group_dao.dart';
import 'package:eplorex/models/group/group_member_model.dart';
import 'package:flutter/material.dart';

import '../../../models/group/group_base_info_model.dart';

class GroupDetailPage extends StatefulWidget {
  const GroupDetailPage({super.key, required this.groupId});

  final num groupId;

  @override
  State<GroupDetailPage> createState() => _GroupDetailPageState();
}

class _GroupDetailPageState extends State<GroupDetailPage> {
  late Future<List<GroupMemberModel>?> _groupMembers;
  late Future<GroupBaseInfoModel?> _groupBaseInfo;
  final AssetImage _arrowRight =
      const AssetImage("images/arrow_right_icon.png");
  final TextStyle _defaultTextStyle = TextStyle(fontSize: 18);

  @override
  void initState() {
    _groupMembers = GroupDao.queryGroupMember(widget.groupId);
    _groupBaseInfo = GroupDao.queryGroupBaseInfo(widget.groupId);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("聊天信息"),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: ListView(
          children: [
            ListTile(
              leading: Text(
                '群成员',
                style: _defaultTextStyle,
              ),
              trailing: Image(
                color: Colors.black45,
                image: _arrowRight,
                width: 20,
              ),
            ),
            FutureBuilder(future: _groupMembers, builder: buildMember),
            FutureBuilder(future: _groupBaseInfo, builder: builderBaseInfo),
            ListTile(
              leading: Text(
                '分享群聊',
                style: _defaultTextStyle,
              ),
              trailing: Image(
                color: Colors.black45,
                image: _arrowRight,
                width: 20,
              ),
            ),
            ListTile(
              leading: Text(
                '设置聊天背景',
                style: _defaultTextStyle,
              ),
              trailing: Image(
                color: Colors.black45,
                image: _arrowRight,
                width: 20,
              ),
            ),
            ListTile(
              leading: Text(
                '本群昵称',
                style: _defaultTextStyle,
              ),
              trailing: Image(
                color: Colors.black45,
                image: _arrowRight,
                width: 20,
              ),
            ),
            ListTile(
              leading: Text(
                '置顶聊天',
                style: _defaultTextStyle,
              ),
              trailing: Switch(value: true, onChanged: (value) {}),
            ),
            ListTile(
              leading: Text(
                '清空聊天记录',
                style: _defaultTextStyle,
              ),
              trailing: Image(
                color: Colors.black45,
                image: _arrowRight,
                width: 20,
              ),
            ),
            ListTile(
              leading: Text(
                '投诉',
                style: _defaultTextStyle,
              ),
              trailing: Image(
                color: Colors.black45,
                image: _arrowRight,
                width: 20,
              ),
            ),
            FilledButton(
                style: ButtonStyle(
                    backgroundColor: MaterialStateProperty.all(Colors.white),
                    foregroundColor:
                        MaterialStateProperty.all(Colors.redAccent),
                    padding: MaterialStateProperty.all(EdgeInsets.zero)),
                onPressed: () {},
                child: const Text(
                  '退出群聊',
                  style: TextStyle(fontSize: 20, color: Colors.red),
                )),
          ],
        ),
      ),
    );
  }

  Widget buildMember(
      BuildContext context, AsyncSnapshot<List<GroupMemberModel>?> snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting ||
        snapshot.data == null) {
      return Container(
        child: Text(""),
      );
    }
    bool showMore = snapshot.data!.length > 25;
    List<GroupMemberModel>? groupMembers = snapshot.data;
    return Container(
        margin: EdgeInsets.symmetric(vertical: 30),
        child: GridView.builder(
            shrinkWrap: true,
            physics: NeverScrollableScrollPhysics(),
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 5,
              childAspectRatio: 1,
              crossAxisSpacing: 10,
              mainAxisSpacing: 30,
            ),
            itemCount: snapshot.data?.length,
            itemBuilder: (context, index) {
              return GestureDetector(
                child: Wrap(
                  alignment: WrapAlignment.center,
                  direction: Axis.horizontal,
                  // mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    CircleAvatar(
                      radius: 30,
                      backgroundImage: NetworkImage(
                          groupMembers?[index].avatar ??
                              "https://randomuser.me/api/portraits/men/71.jpg"),
                    ),
                    SizedBox(
                      height: 5,
                    ),
                    Text(
                      groupMembers?[index].nickName ?? "未知",
                      textAlign: TextAlign.center,
                      style: TextStyle(fontSize: 14),
                    )
                  ],
                ),
              );
            }));
  }

  Widget builderBaseInfo(
      BuildContext context, AsyncSnapshot<GroupBaseInfoModel?> snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting ||
        snapshot.data == null) {
      return Container(
        child: Text(""),
      );
    }
    GroupBaseInfoModel? baseInfoModel = snapshot.data;
    return Card(
      child: Column(
        children: [
          ListTile(
            leading: Text(
              '群名称',
              style: _defaultTextStyle,
            ),
            trailing: Wrap(
              children: [
                Text(
                  '${baseInfoModel?.groupName}',
                  style: _defaultTextStyle,
                ),
                Image(
                  color: Colors.black45,
                  image: _arrowRight,
                  width: 20,
                )
              ],
            ),
          ),
          ListTile(
            leading: Text(
              '群二维码',
              style: _defaultTextStyle,
            ),
            trailing: Image(
              color: Colors.black45,
              image: _arrowRight,
              width: 20,
            ),
          ),
          ListTile(
            leading: Text(
              '群公告',
              style: _defaultTextStyle,
            ),
            trailing: Image(
              color: Colors.black45,
              image: _arrowRight,
              width: 20,
            ),
          ),
          ListTile(
            leading: Text(
              '群备注',
              style: _defaultTextStyle,
            ),
            trailing: Image(
              color: Colors.black45,
              image: _arrowRight,
              width: 20,
            ),
          )
        ],
      ),
    );
  }
}
